<template>
  <div class="create-order-form">
    <div class="form">
      <el-form label-position="left" label-width="90px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="商品主图">
              <img :src="orderDetail.itemMainImg" class="main-img" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="商品名称">
              <span>{{orderDetail.itemName}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="订单号">
              <span>{{orderDetail.orderNumber}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="姓名">
              <span>{{orderDetail.realName}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="手机号">
              <span>{{orderDetail.mobile}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="支付方式">
              <span>{{PAY_TYPE[orderDetail.payType]}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="购买数量">
              <span>×{{orderDetail.quantity}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="应付金额">
              <span class="fee">{{orderDetail.price | formatPrice}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="收货地址">
              <span>{{orderDetail.deliveryLocation}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="订单状态">
              <span>{{ORDER_STATUS[orderDetail.status]}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="销售备注">
              <span>{{orderDetail.sellerRemark}}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  name: "create-order-form",
  components: {},
  props: {
    orderDetail: {
      type: Object
    }
  },
  data() {
    return {
      PAY_TYPE: this.$common.PAY_TYPE,
      ORDER_STATUS: this.$common.ORDER_STATUS
    };
  },
  computed: {},
  watch: {},
  methods: {},
  created() {}
};
</script>

<style lang="scss" scoped>
.create-order-form {
  .form {
    max-height: 400px;
    overflow-y: scroll;
    .main-img {
      width: 80px;
      height: 80px;
    }
  }
}
</style>